<template>
  <page-wrap
    ref="pageWrap"
    hideTab
    back
    :title="title"
    :show-top="showTop"
    :dark="loaded ? false : true"
    :hideSafeArea="true"
    :bg-color="uNavColor"
  >
    <view class="zty" :style="'padding-top:' + navHeight + 'px;'">
      <view class="loginBox">
        <Image
          :class="isLogin ? 'userPic-login' : 'userPic-unlogin'"
          :src="userInfo.userPic"
          @click="showPopup"
        ></Image>
        <span @click="showPopup">{{ isLogin ? '已登录' : '未登录' }}</span>
      </view>
      <view class="banner"
        ><u-swiper
          name="modulePic"
          :list="bannerList"
          @click="handleClickBanner"
        ></u-swiper
      ></view>
      <view class="function-menu">
        <view
          class="menu-item"
          v-for="(item, index) in functionMenuList"
          :key="index"
          @click="menuItemHandleClick1(item)"
        >
          <image :src="item.modulePic"></image>
          {{ item.moduleName }}
        </view>
      </view>
      <view class="hot-activity">
        <view class="title">
          <view class="activity-title">热门活动</view>
          <view class="more" @click="jumpToHotActivity"
            ><view>更多</view> <image class="arrow-right" :src="rightArrowUrl"
          /></view>
        </view>
        <ActivityCard
          v-for="(item, index) in currentActivityList"
          :key="index"
          :imageSrc="item.atPic"
          :activityTitle="item.atName"
          :time="changeDate(item.atStartTime)"
          :position="item.address"
          :price="item.price"
          :termName="item.termName"
          :moduleLink="item.moduleLink"
          @activityHandleClick="activityHandleClick(item)"
        />
      </view>
      <view class="pass-activity">
        <view class="title">
          <view class="activity-title">活动回顾</view>
          <view class="more" @click="jumpToPastActivity"
            ><view>更多</view> <image class="arrow-right" :src="rightArrowUrl"
          /></view>
        </view>
        <ActivityCard
          v-for="(item, index) in pastActivityList"
          :key="index"
          :imageSrc="item.atPic"
          :activityTitle="item.atName"
          :time="changeDate(item.atStartTime)"
          :position="item.address"
          :price="item.price"
          :isPassActivity="true"
          :termName="item.termName"
          :officialAccountLink="item.officialAccountLink"
          @activityHandleClick="activityHandleClick(item, true)"
        />
      </view>
    </view>
    <LoginDialog
      ref="loginDialog"
      @loginSuccessBack="loginSuccessBack"
    ></LoginDialog>
    <userInfoPopup
      ref="userInfoPopup"
      :userInfo="userInfo"
      :listCollection="listCollection"
      :listLockList="listLockList"
      :userInfoPopupShow.sync="userInfoPopupShow"
      v-if="userInfoPopupShow"
      @onClickMyActivity="jumpToAllOrder"
      @onClickOnLineService="jumpToHome"
    >
    </userInfoPopup>
  </page-wrap>
</template>

<script>
import share from '@/mixins/share';
import { debounce } from 'lodash';
import { env } from '@/api/root';
import { personInfo, cardRegist } from '@/api/modules/career';
import ActivityCard from './components/activityCard.vue';
import LoginDialog from '@/components/LoginDialog';
import { addBuryingPoint } from '@/api/modules/career';
import {
  getPersonCardType,
  getDefaultBindZtyCardType
} from '@/api/modules/zty.js';

import { getHomePageData, getActivityTermList } from '@/api/modules/zty.js';

import { getCareerAssessmentVersion } from '@/api/modules/activity';
import userInfoPopup from './components/userInfoPopup.vue';

export default {
  mixins: [share],
  components: {
    ActivityCard,
    LoginDialog,
    userInfoPopup
  },
  onPageScroll(res) {
    this.showTop = res.scrollTop > 0;
  },
  data() {
    return {
      userInfoPopupShow: false,
      userInfo: {
        userPic:
          'https://img3.job1001.com/ypMp/elan/images/careerPath/zty/userPic.png',
        iname: uni.getStorageSync('personName')
      },
      isLogin: false, // 登录状态标识
      sharePath: `/pagesSub/zty/index`,
      shareTitle: '一览职体验',
      personRight: null,
      date: new Date().toISOString(), //现在时间
      uNavColor: '#ffffff',
      showTop: false,
      rightArrowUrl:
        this.$imgBaseSelf + 'career/careerAssessResult/right-arrow.png',
      title: '一览职体验',
      navHeight: getApp().globalData.navHeight,
      bannerList: [
        {
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty-banner.png',
          title: '职体验-1'
        },
        {
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty-banner.png',
          title: '职体验-2'
        }
      ],
      functionMenuList: [
        {
          title: '性格测评',
          url: `https://3gtest.crm1001.com/disc/#/disc/question?personId=${uni
            .getStorageSync('person-id')
            .slice(2)}&iname=${uni.getStorageSync(
            'personName'
          )}&phone=18825449087&from=careerPathResult`,
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty/xgcp.png'
        },
        {
          title: '职业测评',
          url: "/pagesSub/career/activity/vocationalAssessment?fromWhere='junior'",
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty/zycp.png'
        },
        {
          title: '查职业',
          url: '/pagesSub/careerGrow/allCategory/allCategory',
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty/cyz.png'
        },
        {
          title: '查专业',
          url: '/pagesSub/careerNew/positionDictionary/MajorSearchSub',
          image:
            'https://img3.job1001.com/ypMp/elan/images/careerPath/zty/czy.png'
        }
        // {
        //   title: "查院校",
        //   url: "/pagesSub/careerNew/positionDictionary/MajorSearchSub",
        //   image:
        //     "https://img3.job1001.com/ypMp/elan/images/careerPath/zty/cyx.png",
        // },
      ],
      currentActivityList: [], // 当前活动列表
      pastActivityList: [] // 往期活动列表
    };
  },
  methods: {
    jumpToAllOrder() {
      uni.navigateToMiniProgram({
        appId: 'wx614f8a78fff34162',
        path: '/ec_orderDetail/orderlist?productInstanceId=16868908125&vid=0&essharewid=11150280125&share_vid=6016925489125&pmc=3%7C5.essharewid.0-3.vid.0-2%7C3%7C5.share_vid.0',
        success(res) {},
        fail(err) {}
      });
    },
    jumpToHome() {
      uni.navigateToMiniProgram({
        appId: 'wx614f8a78fff34162',
        path: '/cms_design/index?productInstanceId=16868947125&vid=0&essharewid=11150280125&share_vid=6016925489125&pmc=3%7C5.essharewid.0-3.vid.0-2%7C3%7C5.share_vid.0',
        success(res) {},
        fail(err) {}
      });
    },
    showPopup() {
      if (this.isLogin) {
        this.userInfoPopupShow = true;
      } else {
        this.showLoginDialog();
      }
    },
    // 查询用户卡类型
    async getPersonCardTypeFn() {
      const params = {
        personId: uni.getStorageSync('person-id').slice(2)
      };
      const res = await getPersonCardType(params);
      if (res.code == 200) {
        console.log('res', res);
        if (JSON.stringify(res.data) == '{}') {
          // 如果没有绑定卡就调用获取职体验卡类型 然后绑定卡
          console.log('这里去绑卡');
          this.getDefaultBindZtyCardTypeFn();
        } else {
          // 绑定卡就return
          return;
        }
      } else {
        // 这种情况就是未登录 直接return
        return;
      }
    },
    // 获取职体验用户默认绑卡cardType 获取完了调绑卡接口
    async getDefaultBindZtyCardTypeFn() {
      const params = {
        personId: uni.getStorageSync('person-id').slice(2)
      };
      const res = await getDefaultBindZtyCardType(params);
      if (res.code == 200) {
        console.log('res', res);
        this.cardRegistFn(res.data.cardType);
      }
    },
    async cardRegistFn(cardType) {
      const params = {
        cardType: cardType
      };
      const res = await cardRegist(params);
      if (res.code != 200) {
        uni.showToast({ icon: 'none', title: res.status_desc, duration: 1500 });
      }
      if (res.code == 200) {
        uni.setStorageSync('cardType', cardType);
      }
    },
    loginSuccessBack() {
      this.personInfoFn();
      this.getPersonCardTypeFn();
      this.isLogin = true;
    },
    async getCareerAssessmentVersionFn() {
      const params = {
        personId: uni.getStorageSync('person-id').slice(2) || undefined,
        assessmentType: 1
      };
      const res = await getCareerAssessmentVersion(params);
      if (res.code == 200) {
        uni.setStorageSync('assessmentVersion', res.data);
      }
    },
    //普通的埋点+事件停留埋点
    async addBuryingPointFn(
      etId,
      statType,
      jumpPersonId,
      jumpSource,
      sourceType
    ) {
      const params = {
        etId: etId,
        id: this.buryingPointId ? this.buryingPointId : '', //后台要求不能传空，未登录也要统计
        personId: uni.getStorageSync('person-id').slice(2) || '0',
        cardType: this.cardType
          ? this.cardType
          : uni.getStorageSync('cardType') || this.cardType,
        consultantId: uni.getStorageSync('sellId')
          ? uni.getStorageSync('sellId')
          : '',
        originType: this.originFrom == 'shareLink' ? 10 : 20,
        statType: statType ? statType : '10',
        jumpPersonId: jumpPersonId,
        jumpSource: jumpSource,
        sourceType: sourceType
      };
      const res = await addBuryingPoint(params);
    },
    activityHandleClick(item, isPassActivity) {
      console.log('aaaaaaa', item);
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        if (isPassActivity) {
          this.addBuryingPointFn(20305, '', '', '', '');
          console.log('aaaaa');
          // 跳转到往期活动
          // let url = "https://mp.weixin.qq.com/s/d1bp8v6Iw1mRj6YsmwguSQ";
          if (item.officialAccountLink) {
            uni.navigateTo({
              url:
                '/pagesSub/careerGrow/careerSearch/webview?url=' +
                item.officialAccountLink
            });
          } else {
            return;
          }
        } else {
          console.log('bbbb');
          this.addBuryingPointFn(20303, '', '', '', '');
          // 这里应该跳转到微盟活动详情页
          uni.navigateToMiniProgram({
            appId: 'wx614f8a78fff34162',
            // path: "/ec_goods/detail?productInstanceId=16868908125&vid=0&id=128377299100125",
            path: item.weimobLink,
            success(res) {},
            fail(err) {}
          });
        }
      }
    },
    showLoginDialog() {
      this.$refs.loginDialog.setVisibility(true);
    },
    async personInfoFn() {
      const params = {
        personId: uni.getStorageSync('person-id').slice(2)
      };
      const res = await personInfo(params);
      if (res.code == 200) {
        this.personRight = res.data.personRight;
        uni.setStorageSync('personName', res.data.personDetail.iname);
        this.userInfo.userPic = res.data.personDetail.pic;
        this.userInfo.iname = res.data.personDetail.iname;
      }
    },
    changeDate(date) {
      let myDay = new Date(date.slice(0, 10)).getDay(); //将返回0，表示星期天
      switch (myDay) {
        case 0:
          myDay = date.slice(0, 10) + ' 周日 ' + date.slice(11, 16);
          break;
        case 1:
          myDay = date.slice(0, 10) + ' 周一 ' + date.slice(11, 16);
          break;
        case 2:
          myDay = date.slice(0, 10) + ' 周二 ' + date.slice(11, 16);
          break;
        case 3:
          myDay = date.slice(0, 10) + ' 周三 ' + date.slice(11, 16);
          break;
        case 4:
          myDay = date.slice(0, 10) + ' 周四 ' + date.slice(11, 16);
          break;
        case 5:
          myDay = date.slice(0, 10) + ' 周五 ' + date.slice(11, 16);
          break;
        case 6:
          myDay = date.slice(0, 10) + ' 周六 ' + date.slice(11, 16);
          break;
        default:
          break;
      }
      return myDay;
    },
    dateFormat(time) {
      let date = new Date(time);
      let year = date.getFullYear();
      // 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
      let month =
        date.getMonth() + 1 < 10
          ? '0' + (date.getMonth() + 1)
          : date.getMonth() + 1;
      let day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
      let hours =
        date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
      let minutes =
        date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
      let seconds =
        date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
      // 拼接
      return (
        year +
        '-' +
        month +
        '-' +
        day +
        ' ' +
        hours +
        ':' +
        minutes +
        ':' +
        seconds
      );
      // return year + "-" + month + "-" + day;
    },
    async getActivityTermListFn(searchType) {
      const params = {
        searchType: searchType,
        currentTime: this.dateFormat(this.date),
        isRecommend: searchType == '10' ? '1' : '2',
        pageSize: 2,
        pageNo: 1
      };
      const res = await getActivityTermList(params);
      if (res.code == 200) {
        if (searchType == '30') {
          this.pastActivityList = res.data;
          // 往期回顾
        } else {
          // 热门活动
          this.currentActivityList = res.data;
        }
      }
    },
    async getHomePageDataFn() {
      const params = {};
      const res = await getHomePageData(params);
      if (res.code == 200) {
        console.log('res', res);
        res.data.forEach((item) => {
          switch (item.moduleType) {
            case 'zty_banner':
              this.bannerList = item.children;
              break;
            case 'zty_feature':
              this.functionMenuList = item.children;
              break;
            default:
              break;
          }
        });
      }
    },
    jumpToHotActivity() {
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        this.addBuryingPointFn(20304, '', '', '', '');

        uni.navigateTo({
          url: '/pagesSub/zty/hotActivity/index'
        });
      }
    },
    jumpToPastActivity() {
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        this.addBuryingPointFn(20306, '', '', '', '');

        uni.navigateTo({
          url: '/pagesSub/zty/pastActivity/index'
        });
      }
    },
    handleClickBanner(index) {
      this.addBuryingPointFn(20301, '', '', '', '');
      console.log(index);
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        // 这里应该跳转到微盟活动详情页
        uni.navigateToMiniProgram({
          appId: 'wx614f8a78fff34162',
          // path: "/ec_goods/detail?productInstanceId=16868908125&vid=0&id=128377299100125",
          path: this.bannerList[index].moduleLink,
          success(res) {},
          fail(err) {}
        });
      }
    },
    menuItemHandleClick: debounce(function (item) {
      console.log('这里点击了菜单哦', item);
      this.addBuryingPointFn(20302, '', '', '', '');
      this.getCareerAssessmentVersionFn();
      console.log(item);
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        if (item.moduleName == '性格测评') {
          this.personInfoFn();
          setTimeout(() => {
            console.log('this.personRight', this.personRight);
            if (!this.personRight) {
              // 否则就去做题
              if (env == 'test' || env == 'local') {
                let url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              } else if (env == 'pro' || env == 'pre') {
                let url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              }
            }
            if (this.personRight.personalityQuiz) {
              const extra = JSON.parse(this.personRight.personalityQuiz.extra);
              if (extra && extra.character) {
                // 如果存在就去结果页
                if (env == 'test' || env == 'local') {
                  let url = `https://3gtest.crm1001.com/disc/#/disc/result?userId=${
                    extra.userId
                  }&iname=${uni.getStorageSync(
                    'personName'
                  )}&from=careerPathResult`;
                  uni.navigateTo({
                    url:
                      '/pagesSub/public/web/descWebView?link=' +
                      encodeURIComponent(url)
                  });
                } else if (env == 'pro' || env == 'pre') {
                  let url = `https://3g.crm1001.com/disc/#/disc/result?userId=${
                    extra.userId
                  }&iname=${uni.getStorageSync(
                    'personName'
                  )}&from=careerPathResult`;
                  uni.navigateTo({
                    url:
                      '/pagesSub/public/web/descWebView?link=' +
                      encodeURIComponent(url)
                  });
                }
              }
            } else {
              // 否则就去做题
              if (env == 'test' || env == 'local') {
                let url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              } else if (env == 'pro' || env == 'pre') {
                let url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              }
            }
          }, 500);
        } else {
          if (item.moduleName == '职业测评') {
            uni.navigateTo({
              url: `/pagesSub/career/activity/vocationalAssessment?fromWhere=junior&personId=${personId}&assessmentType=1`
            });
          } else {
            uni.navigateTo({
              url: item.moduleLink
            });
          }
        }
      }
    }, 0),
    menuItemHandleClick1(item) {
      console.log('这里点击了菜单哦', item);
      this.addBuryingPointFn(20302, '', '', '', '');
      this.getCareerAssessmentVersionFn();
      console.log(item);
      let personId = uni.getStorageSync('person-id').slice(2) || '';
      if (!personId) {
        this.showLoginDialog();
      } else {
        if (item.moduleName == '性格测评') {
          this.personInfoFn();
          console.log('this.personRight', this.personRight);
          if (!this.personRight) {
            // 否则就去做题
            if (env == 'test' || env == 'local') {
              let url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${uni
                .getStorageSync('person-id')
                .slice(2)}&iname=${uni.getStorageSync(
                'personName'
              )}&phone=18825449087&from=careerPathResult`;
              uni.navigateTo({
                url:
                  '/pagesSub/public/web/descWebView?link=' +
                  encodeURIComponent(url)
              });
            } else if (env == 'pro' || env == 'pre') {
              let url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${uni
                .getStorageSync('person-id')
                .slice(2)}&iname=${uni.getStorageSync(
                'personName'
              )}&phone=18825449087&from=careerPathResult`;
              uni.navigateTo({
                url:
                  '/pagesSub/public/web/descWebView?link=' +
                  encodeURIComponent(url)
              });
            }
          }
          setTimeout(() => {
            if (this.personRight.personalityQuiz) {
              const extra = JSON.parse(this.personRight.personalityQuiz.extra);
              if (extra && extra.character) {
                // 如果存在就去结果页
                if (env == 'test' || env == 'local') {
                  let url = `https://3gtest.crm1001.com/disc/#/disc/result?userId=${
                    extra.userId
                  }&iname=${uni.getStorageSync(
                    'personName'
                  )}&from=careerPathResult`;
                  uni.navigateTo({
                    url:
                      '/pagesSub/public/web/descWebView?link=' +
                      encodeURIComponent(url)
                  });
                } else if (env == 'pro' || env == 'pre') {
                  let url = `https://3g.crm1001.com/disc/#/disc/result?userId=${
                    extra.userId
                  }&iname=${uni.getStorageSync(
                    'personName'
                  )}&from=careerPathResult`;
                  uni.navigateTo({
                    url:
                      '/pagesSub/public/web/descWebView?link=' +
                      encodeURIComponent(url)
                  });
                }
              }
            } else {
              // 否则就去做题
              if (env == 'test' || env == 'local') {
                let url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              } else if (env == 'pro' || env == 'pre') {
                let url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${uni
                  .getStorageSync('person-id')
                  .slice(2)}&iname=${uni.getStorageSync(
                  'personName'
                )}&phone=18825449087&from=careerPathResult`;
                uni.navigateTo({
                  url:
                    '/pagesSub/public/web/descWebView?link=' +
                    encodeURIComponent(url)
                });
              }
            }
          }, 500);
        } else {
          if (item.moduleName == '职业测评') {
            uni.navigateTo({
              url: `/pagesSub/career/activity/vocationalAssessment?fromWhere=junior&personId=${personId}&assessmentType=1`
            });
          } else {
            uni.navigateTo({
              url: item.moduleLink
            });
          }
        }
      }
    }
  },
  created() {
    this.getHomePageDataFn();
    console.log('当前时间：', this.dateFormat(this.date));
    this.getActivityTermListFn('10');
    this.getActivityTermListFn('30');
    this.personInfoFn();
    this.getPersonCardTypeFn();
  },
  mounted() {
    this.isLogin = uni.getStorageSync('person-id') ? true : false;
  }
};
</script>

<style lang="scss" scoped>
$img-base-person: $img-base + 'careerPath/';

@font-face {
  font-family: 'YouSheBiaoTiHei-2';
  /*定义字体名称*/
  src: url('https://img3.job1001.com/ypMp/elan/fontFamily/careerPath/YouSheBiaoTiHei-2.ttf');
}

.zty {
  background-image: url($img-base + 'careerPath/zty-bg.png');
  background-size: 100% 832rpx;
  background-repeat: no-repeat;
  height: 85vh;
  // height: calc(100vh - 210rpx);
  .loginBox {
    margin: 0 32rpx;
    width: calc(100% - 64rpx);
    padding: 0 32rpx;
    height: 64rpx;
    border-radius: 8rpx;
    border: 2rpx solid #ffffff;
    background: rgba(255, 255, 255, 0.02);
    box-shadow: 0rpx 2rpx 28rpx 0rpx rgba(127, 152, 207, 0.12);
    display: flex;
    flex-direction: row;
    align-items: center;
    font-family: YouSheBiaoTiHei-2;
    font-size: 28rpx;
    .userPic-login,
    .userPic-unlogin {
      width: 48rpx;
      height: 48rpx;
      margin-right: 16rpx;
      border-radius: 50%;
    }
    .userPic-login {
      color: #333333;
    }
    .userPic-unlogin {
      color: #999999;
    }
  }
  .banner {
    width: 100%;
    height: 240rpx;
    margin-top: 24rpx;
    padding: 0 32rpx;
    ::v-deep .u-swiper-image {
      border-radius: 18rpx;
    }
  }
  .function-menu {
    width: calc(100% - 64rpx);
    padding: 36rpx 26rpx 24rpx 26rpx;
    background-color: #ffffff;
    border-radius: 24rpx;
    margin: 0 auto;
    margin-top: 24rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    .menu-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 24rpx;
      color: #333333;
      image {
        width: 92rpx;
        height: 90rpx;
      }
    }
  }
  .hot-activity,
  .pass-activity {
    width: 100%;
    background-color: #ffffff;
    border-radius: 24rpx;
    // height: 536rpx;
    padding: 32rpx;
    padding-bottom: 72rpx;
    box-sizing: border-box;
    margin-top: 24rpx;
    .title {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      // margin-bottom: 32rpx;
      .activity-title {
        font-weight: 800;
      }
      .more {
        width: 100rpx;
        height: 50rpx;
        background: #f9f9f9;
        border-radius: 25rpx;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        font-family: PingFangSC, PingFang SC;
        font-weight: 500;
        font-size: 22rpx;
        color: #555555;
        padding-left: 8rpx;
        .arrow-right {
          width: 20rpx;
          height: 20rpx;
        }
      }
    }
  }
}
</style>
